table.table.table-lg {
  td,
  tr,
  th {
    border-width: 0;
  }

  border-collapse: separate;
  border-spacing: 0 16px;

  thead {
    th {
      color: #{$slate-shade-100};
      background: #{$gray-800};
      text-transform: uppercase;
      font-size: 0.75rem;
      padding: 16px 12px 16px 0;

      &:first-of-type {
        padding-left: 67px;
      }
    }

    tr {
      th:first-child {
        border-top-left-radius: $border-radius;
      }
      th:last-child {
        border-top-right-radius: $border-radius;
      }
    }
  }

  tbody {
    tr {
      &.active {
        td {
          background: #{$gray-800};
        }
      }

      td {
        background: #{$gray-600};
        vertical-align: middle;
        padding: 20px 12px 20px 0;

        &:first-of-type {
          padding-left: 67px;
        }
      }

      td:first-child {
        border-top-left-radius: $border-radius;
        border-bottom-left-radius: $border-radius;
      }
      td:last-child {
        border-top-right-radius: $border-radius;
        border-bottom-right-radius: $border-radius;
      }
    }
  }

  &.selectable {
    --bs-table-hover-bg: #{$gray-700};

    tbody {
      tr:hover {
        cursor: pointer;
        background: #{$gray-800};
      }
    }
  }

  & {
    --bs-table-hover-bg: #{$gray-600};
  }

  .table-cell-content {
    height: 100%;
  }
}

table.table.table-lg.alt-style {
  border: 1px solid #{$peach-tint-100};
  border-spacing: 0px;
  background: #{$gray-800};
  border-radius: $border-radius;
  --bs-table-hover-bg: #{$gray-800};

  tbody {
      tr td {
      background-color: #{$gray-800};
      border-radius: 0;
    }
  }

  tfoot tr td {
      background-color: #{$gray-700};
      padding: 16px 0px;
  }

  td:first-child, td:last-child {
    width: 67px;
    padding: 0px
  }

  tr:first-child td:first-child {
    border-top-left-radius: $border-radius;
  }

  tr:first-child td:last-child {
    border-top-right-radius: $border-radius;
  }

  tr:last-child td:first-child {
    border-bottom-left-radius: $border-radius;
  }

  tr:last-child td:last-child {
    border-bottom-right-radius: $border-radius;
  }
}
